ShowTable of Contents
概要
XPages Extension Library [Dojo Combo Box]の利用方法について記述する。
Dojo Combo Boxとは
[Dojo Combo Box]は通常の[コンボボックス]と同様に選択肢の一覧を表示する事ができる。
通常のコンボボックスとの違いは以下となる
-
[Dojo Combo Box]では選択肢の直接入力ができる事
-
タイプアヘッドが利用できる事
実現方法
1.[Dojo Combo Box]の配置
Dojo Formより[Dojo Combo Box]を配置する。
2. 選択肢を設定する
XPage の「ソース」タブを開き、「」タグで選択肢を追加する。
3. プロパティを設定する
後述するCombo Boxのプロパティ一覧に従って設定する。
Dojo Combo Boxのプロパティ一覧
|
カテゴリ
|
プロパティ
|
説明
|
|
スタイル
|
disableTheme
|
|
|
|
style
|
Accordionのスタイル
|
|
データ
|
value
|
Combo Boxの選択肢とバインドするデータを設定する。
|
|
基本
|
attrs
|
|
|
|
Binding
|
|
|
|
Id
|
コントロール識別用のID
|
|
|
Loaded
|
|
|
|
rendered
|
|
|
|
rendereType
|
|
サンプルの XPage ソースコード
<xe:djComboBox id="djComboBox1"
value="#{sessionScope.djComboBox1}">
<xp:selectItem itemLabel="とうきょう" itemValue="tokyo"></xp:selectItem>
<xp:selectItem itemLabel="しながわ" itemValue="shinagawa"></xp:selectItem>
<xp:selectItem itemLabel="しぶや" itemValue="shibuya"></xp:selectItem>
<xp:selectItem itemLabel="しんじゅく" itemValue="shinjyuku"></xp:selectItem>
<xp:selectItem itemLabel="いけぶくろ" itemValue="ikebukuro"></xp:selectItem>
<xp:selectItem itemLabel="うえの" itemValue="ueno"></xp:selectItem>
<xp:eventHandler event="onChange" submit="true"
refreshMode="complete">
<xe:this.action><![CDATA[#{javascript:print("Dojo Combo is changed.");}]]></xe:this.action>
</xp:eventHandler>
</xe:djComboBox>
調査環境
Lotus Notes/Domino 8.5.3 + Upgrade Pack 1 + Extension Library